$(function (){

    var $info_form              = $('#info-form'),
        $table                  = $('#order-table');

    // 定义表格和翻页链接的变量
    var $prev = $('.nav-bottom div:first');
    var $next = $('.nav-bottom div:last');
    var $currentPage = $('.current-page');

    // 定义每页行数和当前页码的变量
    var numRowsPerPage = 13;
    var currentPageNum = 1;
    var numRows;

    function initRow() {
        currentPageNum = 1;
    // 根据行数和每页行数计算总页数
        numRows = $table.find('tr:visible').length - 1;
        console.log(numRows);
        var numPages = Math.ceil(numRows / numRowsPerPage);

    // 隐藏除前numRowsPerPage行之外的所有行
        $table.find('tr:visible:gt(' + (numRowsPerPage) + ')').hide();

    // 更新总行数和当前页码
        $('.total').text('共' + numRows + '条 ' + numPages + '页 ');
        $currentPage.text('第' + currentPageNum + '页');
    }

    initRow();

    // 监听上一页链接的点击事件
    $prev.click(function () {
        if (currentPageNum > 1) {
            // 隐藏当前行
            var startRow = (currentPageNum - 1) * numRowsPerPage + 1;
            var endRow = (currentPageNum) * numRowsPerPage;
            $table.find('tr:gt(' + (startRow - 1) + '):lt(' + (endRow - startRow + 1) + ')').hide();

            // 显示上一页的行
            startRow = (currentPageNum - 2) * numRowsPerPage + 1;
            endRow = (currentPageNum - 1) * numRowsPerPage;
            $table.find('tr:gt(' + (startRow - 1) + '):lt(' + (endRow - startRow + 1) + ')').show();

            // 更新当前页码
            currentPageNum--;
            $currentPage.text('第' + currentPageNum + '页');
        }
    })

    //下一页点击事件
    $next.click(function () {
        console.log(numRows)
        var numPages = Math.ceil(numRows / numRowsPerPage);
        if (currentPageNum < numPages) {
            // 隐藏当前行
            var startRow = (currentPageNum - 1) * numRowsPerPage + 1;
            var endRow = (currentPageNum) * numRowsPerPage;
            $table.find('tr:gt(' + (startRow - 1) + '):lt(' + (endRow - startRow + 1) + ')').hide();

            // 显示下一页的行
            startRow = (currentPageNum) * numRowsPerPage + 1;
            endRow = (currentPageNum + 1) * numRowsPerPage;
            $table.find('tr:gt(' + (startRow - 1) + '):lt(' + (endRow - startRow + 1) + ')').show();

            // 更新当前页码
            currentPageNum++;
            $currentPage.text('第' + currentPageNum + '页');
        }
    });


    //重置功能：显示所有订单
    $(document).delegate('#btn-reset','click',function () {
        var $tr_order_data    = $('tr.order-data');
        //下拉列表选择请选择
        $('.select-comboBox').val('请选择');
        $tr_order_data.show();
        initRow();
    })


    //筛选订单
    //订单状态
    $(document).delegate('#order-comboBox','change',function () {
        var $tr_order_data    = $('tr.order-data'),
            select_order    = $('#order-comboBox').val();
        console.log('选择订单:'+select_order);
        if(select_order !== '请选择'){
            //筛选订单
            // $tr_order_data.hide().filter(":contains('"+select_order+"')").show();
            var searchCol = 6;
            var rowsLength = $table[0].rows.length;
            for(var i=1;i<=rowsLength;i++){
                var row = $table[0].rows[i];
                if (row) { // 检查行是否已定义
                    var selectValue = row.cells[searchCol].querySelector('select').value;
                    console.log(selectValue);
                    if(selectValue.match(select_order)){
                        row.style.display='';//显示行操作
                    }else{
                        row.style.display='none';//隐藏行操作
                    }
                }
            }
            initRow();
        }else{
            //全显示
            $tr_order_data.show();
            initRow();
        }
    });



    //删除订单
    $table.delegate('#delete-order-btn','click',function () {
        var result = confirm('是否删除');
        if(result){
            var orderId = $(this).closest('tr').find('td:eq(0)').text();

            //数据库中删除该图书
            $.ajax({
                type:'GET',
                url:'deleteOrder',
                data:{
                    orderId:orderId
                },
                success:function () {
                    console.log("订单："+orderId+" 删除成功......")
                }
            });
        }
    });

    //编辑订单状态
    $table.delegate('#edit-order-btn','click',function () {
        $(this).addClass('gray');
        $(this).closest('tr').find('#confirm-edit-order-btn').show();
        $(this).closest('tr').find('#order-status-selectList').removeAttr('disabled');
    });
    //确认编辑订单状态
    $table.delegate('#confirm-edit-order-btn','click',function () {
        //数据库修改订单信息
        //订单状态下拉列表不可选中
        $(this).closest('tr').find('#order-status-selectList').attr('disabled','disabled');
        //编辑按钮可选，隐藏确认按钮
        $(this).closest('tr').find('#edit-order-btn').removeClass('gray');
        $(this).closest('tr').find('#confirm-edit-order-btn').hide();
        var orderId = $(this).closest('tr').find('td:eq(0)').text();
        var orderStatus = $(this).closest('tr').find('#order-status-selectList option:selected').text()
        $.ajax({
            url: "editOrderStatus",
            data: {
                orderId: orderId,
                orderStatus: orderStatus
            }
        });

    })

    //查看订单详情
    $(document).delegate('#info-order-btn','click',async function () {

        var orderId = $(this).closest('tr').find('td:eq(0)').text(),
            username = $(this).closest('tr').find('td:eq(1)').text(),
            orderDate = $(this).closest('tr').find('td:eq(2)').text();
        $info_form.show();
        console.log("点击订单：" + orderId + " 详情按钮......")
        $(this).addClass('gray');

        //将订单基本信息写入input中
        $('#info-orderId').val(orderId);
        $('#info-username').val(username);
        $('#info-date').val(orderDate);
        //将信息传入后端调取订单信息刷新页面
        // $.ajax({
        //     url:"orderInfo",
        //     data:{
        //         orderId:orderId
        //     },
        //     success:function (data){
        //         console.log("订单："+orderId+" 信息更新成功......")
        //     }
        // })
        // Make the AJAX request to fetch the updated data
        var orderInfoURL = '/orderInfo?orderId='+orderId;
        const response = await fetch(orderInfoURL);
        // Parse the response as JSON
        const lineItems = await response.json();
        console.log(lineItems);
        // Update the table with the new line items
        const tableBody = document.querySelector('.order-info-table tbody');
        tableBody.innerHTML = '<tr class="table-title">\n' +
            '                <th class="col1">编号</th>\n' +
            '                <th class="col2">宠物编号</th>\n' +
            '                <th class="col3">所属品种</th>\n' +
            '                <th class="col4">所属种类</th>\n' +
            '                <th class="col5">单价</th>\n' +
            '                <th class="col6">购买数量</th>\n' +
            '                <th class="col7">单条宠物总额</th>\n' +
            '            </tr>';
        lineItems.forEach((lineItem) => {
            const row = document.createElement('tr');
            row.innerHTML = `
                            <td>${lineItem.lineNumber}</td>
                            <td>${lineItem.itemId}</td>
                            <td>${lineItem.productId}</td>
                            <td>${lineItem.categoryId}</td>
                            <td>${lineItem.unitPrice}</td>
                            <td>${lineItem.quantity}</td>
                            <td>${lineItem.unitPrice * lineItem.quantity}</td>
            `;
            tableBody.appendChild(row);
        });

        //设置info_form的高度适应表格高度
        var height = $info_form.height()
        $info_form.height(height + 50);

    })
    //关闭订单详情页面
    $(document).delegate('#close-info-form-btn','click',function () {
        $info_form.hide();
        //设置info_form的高度适应表格高度
        var height=$info_form.height()
        $info_form.height(height-50);
        $('.action-btn').removeClass('gray');
    })

    //根据用户名查询订单
    $(document).delegate('#username-search-input','input',function (){
        var key    = $(this).val();
        var $table = $('#order-table');
        if(key===''||key===null){
            initRow();
            //重置所有筛选框
            $('.select-comboBox').val('请选择');
        }
        var rowsLength = $table[0].rows.length;
        setTimeout(function(){
            var searchCol = 1;
            for(var i=1;i<=rowsLength;i++){
                var row = $table[0].rows[i];
                if (row) { // 检查行是否已定义
                    var searchText = row.cells[searchCol].textContent;
                    console.log(searchText);
                    if(searchText.match(key)){
                        row.style.display='';//显示行操作
                    }else{
                        row.style.display='none';//隐藏行操作
                    }
                }
            }
        },200)
    })



})